body,
html {
  line-height: 1;
  font-weight: 200;
  font-family: 'PingFang SC', 'STHeitiSC-Light', 'Helvetica-Light', 'arial', 'sans-serif';
}

.clearfix {
  display: inline-block;
  &:after {
    display: block;
    content: ".";
    height: 0;
    line-height: 0;
    clear: both;
    visibility: hidden;
  }
}

// @media (-webkit-min-device-pixel-ratio: 1.5),(min-device-pixel-ratio: 1.5)
//   .border-1px
//     &::after
//       -webkit-transform: scaleY(0.7)
//       transform: scaleY(0.7)
// @media (-webkit-min-device-pixel-ratio: 2),(min-device-pixel-ratio: 2)
//   .border-1px
//     &::after
//       -webkit-transform: scaleY(0.5)
//       transform: scaleY(0.5)
@media(-webkit-min-device-pixel-ratio:1.5),
(min-device-pixel-ratio:1.5) {
  .border-t-1px {
    &::before {
      -webkit-transform: scaleY(0.7);
      transform: scaleY(0.7);
    }
  }
}

@media(-webkit-min-device-pixel-ratio:2),
(min-device-pixel-ratio:2) {
  .border-t-1px {
    &::before {
      -webkit-transform: scaleY(0.5);
      transform: scaleY(0.5);
    }
  }
}

@media(-webkit-min-device-pixel-ratio:2.5),
(min-device-pixel-ratio:2.5) {
  .border-t-1px {
    &::before {
      -webkit-transform: scaleY(0.33333334);
      transform: scaleY(0.33333334);
    }
  }
}

@media(-webkit-min-device-pixel-ratio:1.5),
(min-device-pixel-ratio:1.5) {
  .border-b-1px {
    &::after {
      -webkit-transform: scaleY(0.7);
      transform: scaleY(0.7);
    }
  }
}

@media(-webkit-min-device-pixel-ratio:2),
(min-device-pixel-ratio:2) {
  .border-b-1px {
    &::after {
      -webkit-transform: scaleY(0.5);
      transform: scaleY(0.5);
    }
  }
}

@media(-webkit-min-device-pixel-ratio:2.5),
(min-device-pixel-ratio:2.5) {
  .border-b-1px {
    &::after {
      -webkit-transform: scaleY(0.33333334);
      transform: scaleY(0.33333334);
    }
  }
}
